<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>margin-auto自動垂直水平居中</title>
	<style type="text/css">
		.father{
			height:200px;
			width:100px;
			background-color: #000;
			writing-mode: vertical-lr;
		}
		.son{
			height:100px;
			width:100px;
			margin:auto;
			background-color: #cd0000;
		}
		.fa-2{ text-align: center; height: 200px; }
		.fa-2 img{ width:50px; height: 50px; }
	</style>
</head>
<body>
	<h3>1.writing-mode vertical-lr 垂直居中</h3>
	<div class="father">
		<div class="son"></div>
	</div>

	<h3>2.img 垂直水平居中</h3>
	<div class="fa-2">
		<img src="http://hiphotos.baidu.com/doc/pic/item/54fbb2fb43166d22ba9e1a1e4f2309f79152d24b.jpg">
	</div>
</body>
</html>